<template>
    <view class="box">
        <!-- 图片轮播 -->
        <view class="u-demo-block" v-if="currentProduct.topImage">
            <u-swiper
                :list="currentProduct.topImage"
                @change="(e) => (currentNum = e.current)"
                :autoplay="false"
                indicatorStyle="right: 40rpx"
                height="750rpx"
                radius="0"
                imgMode="aspectFit"
                @click="topImageClick"
            >
                <view slot="indicator" class="indicator-num">
                    <text class="indicator-num__text"
                        >{{ currentNum + 1 }}/{{
                            currentProduct.topImage &&
                            currentProduct.topImage.length
                        }}</text
                    >
                </view>
            </u-swiper>
        </view>
        <!-- 标题模块 -->
        <view
            v-if="!hideBtn"
            class="title"
            :style="{
                paddingBottom:
                    currentProduct.keyword &&
                    currentProduct.keyword.length === 0
                        ? '24rpx'
                        : '0',
            }"
        >
            <u-text :text="currentProduct.goodsName" size="30rpx" bold />
            <view class="flex_wrap">
                <view class="price">
                    <text class="price_t">￥</text>
                    <text>
                        {{ formatDecimal(numDiv(unitPrice, 100)) || '0'}}
                    </text>
                </view>
                <view class="price1" v-if="!showOriginalPrice">
                    <text class="price_t">￥</text>
                    <text v-if="currentProduct.price">
                        {{ formatDecimal(numDiv(currentProduct.price, 100)) }}
                    </text>
                    <text v-else> 0 </text>
                </view></view
            >
            <u-gap height="10rpx" />
            <view class="flex_wrap row_between">
                <view class="flex_wrap title-t">
                    <block>
                        <text> 限时优惠 </text>
                    </block>
                </view>
                <view class="flex_wrap title-t">
                    <block
                        v-if="
                            currentProduct.keyword &&
                            currentProduct.keyword.length > 0
                        "
                    >
                        <text
                            v-for="item in currentProduct.keyword"
                            :key="item"
                        >
                            {{ item }}
                        </text>
                    </block>
                </view>
                <view class="flex_wrap row_between" style="width: 118rpx">
                    <u-icon
                        v-if="!currentProduct.ifCollection"
                        name="/pages_shop1/static/img/shop/nostart.png"
                        size="52rpx"
                        @click="doCollect(currentProduct.id)"
                    ></u-icon>
                    <u-icon
                        v-else="currentProduct.ifCollection"
                        name="/pages_shop1/static/img/shop/start.png"
                        size="52rpx"
                        @click="cancelCollect(currentProduct.id)"
                    ></u-icon>
                    <u-icon
						v-if="unitPrice"
                        size="52rpx"
                        name="/pages_shop1/static/img/shop/share.png"
                        @click="share"
                    ></u-icon>
                </view>
            </view>
            <u-gap height="24rpx" />
        </view>
        <u-gap
            height="14rpx"
            bgColor="#F5F5F5"
            v-if="
                currentProduct.returnReceiver ||
                currentProduct.returnReceiverPhone ||
                currentProduct.reportingPeriod ||
                currentProduct.returnAddress
            "
        />
        <!-- 地址报告 -->
        <view
            class="address flex_wrap flex_column"
            v-if="
                currentProduct.returnReceiver ||
                currentProduct.returnReceiverPhone ||
                currentProduct.reportingPeriod ||
                currentProduct.returnAddress
            "
        >
            <u-row v-if="currentProduct.reportingPeriod">
                <u-col span="3">
                    <u-text text="报告周期" bold size="26rpx" />
                </u-col>
                <u-col span="8">
                    <u-text
                        :text="currentProduct.reportingPeriod + '个工作日'"
                        size="26rpx"
                    />
                </u-col>
            </u-row>
            <u-gap height="20rpx" v-if="currentProduct.returnAddress" />
            <u-row
                justify="space-between"
                align="top"
                v-if="currentProduct.returnAddress"
            >
                <u-col span="3">
                    <u-text text="回寄地址" size="26rpx" bold />
                </u-col>
                <u-col span="9">
                    <u-text :text="currentProduct.returnAddress" size="26rpx" />
                </u-col>
            </u-row>
            <u-gap
                height="20rpx"
                v-if="
                    currentProduct.returnReceiver ||
                    currentProduct.returnReceiverPhone
                "
            />
            <u-row
                v-if="
                    currentProduct.returnReceiver ||
                    currentProduct.returnReceiverPhone
                "
            >
                <u-col span="3">
                    <u-text text="收件人" bold size="26rpx" />
                </u-col>
                <u-col span="9">
                    <u-text
                        :text="`${currentProduct.returnReceiver} ${currentProduct.returnReceiverPhone}`"
                        size="26rpx"
                    />
                </u-col>
            </u-row>
        </view>
        <u-gap height="14rpx" bgColor="#F5F5F5" />
        <view
            class="detailImages"
            v-if="
                currentProduct.detailImage &&
                currentProduct.detailImage.length > 0
            "
        >
            <view style="padding: 20rpx 28rpx 24rpx">
                <u-text color="#333" text="详情介绍" size="30rpx" bold></u-text>
            </view>
            <u-gap height="20rpx" />
            <view
                style="width: 100vw; padding: 0 28rpx; box-sizing: border-box"
            >
                <u-image
                    width="100%"
                    lazyLoad
                    :src="item"
                    v-for="(item, index) in currentProduct.detailImage"
                    mode="widthFix"
                    height="auto"
                    :key="item"
                    @click="previewDetailImage(item)"
                />
            </view>
            <u-gap height="140rpx" />
        </view>
        <u-gap height="17rpx;" bgColor="#FFF"></u-gap>
        <view class="purchase safeAreaBottom flex_wrap" v-if="!hideBtn">
            <u-button
                :text="unitPrice ? '立即购买' : '立即领取'"
                color="#588BF3"
                :hairline="false"
                shape="circle"
                :customStyle="buttonCustomStyle"
                @click="toBuy"
            />
        </view>
        <!-- 规格弹框 -->
        <view
            @touchmove.stop.prevent="
                () => {
                    return;
                }
            "
        >
            <u-popup :round="20" :show="show" @close="close" @open="open">
                <view
                    class="specifications safeAreaBottom"
                    @touchmove.stop.prevent="
                        () => {
                            return;
                        }
                    "
                >
                    <view class="price_total">
                        <view>
                            <text class="price_t">￥</text>
                            <text v-if="currentProduct.price">{{
                                formatDecimal(getPriceSkuPrice)
                            }}</text>
                            <text v-else> 0 </text>
                        </view>
                        <!-- 有优惠劵显示 实付价格 -->
                        <view
                            class="price_actual"
                            v-if="
                                dataList.length &&
                                (couponRadiovalue || specialPrice === null)
                            "
                        >
                            <text>实付价￥</text>
                            <text class="price_actual_t">
                                {{ getPrice }}
                            </text>
                        </view>

                        <view
                            class="price_actual"
                            v-if="specialPrice !== null && !couponRadiovalue"
                        >
                            <text>优选价￥</text>
                            <text class="price_actual_t">
                                {{ numDiv(specialPrice, 100) }}
                            </text>
                        </view>
                    </view>
                    <!-- 地址 -->
                    <chooseAddress
                        ref="childRef"
                        @changeAddress="changeAddress"
                    ></chooseAddress>
                    <u-gap
                        marginTop="20rpx"
                        marginBottom="24rpx"
                        height="2rpx;"
                        bgColor="#F3F3F3"
                    ></u-gap>
                    <scroll-view
                        scroll-y="true"
                        style="max-height: 600rpx"
                        v-if="currentProduct.simpleSpecs"
                    >
                        <view
                            v-for="(item, index) in currentProduct.simpleSpecs"
                            :key="item.specificationName"
                        >
                            <u-text
                                :text="item.specificationName"
                                size="28rpx"
                                bold
                            ></u-text>
                            <u-gap height="16rpx;"></u-gap>
                            <view class="flex_wrap typeChoose">
                                <view class="specs">
                                    <view
                                        class="tag-item"
                                        v-for="(
                                            specsItem, specsItemIndex
                                        ) in item.items"
                                        :key="specsItem.value"
                                    >
                                        <u-tag
                                            borderColor="#588BF3"
                                            size="medium"
                                            :text="specsItem.value"
                                            :plain="!specsItem.checked"
                                            :name="specsItemIndex"
                                            @click="radioClick($event, index)"
                                        />
                                    </view>
                                </view>
                            </view>
                            <u-gap
                                marginTop="6rpx"
                                marginBottom="24rpx"
                                height="2rpx;"
                                bgColor="#F3F3F3"
                            ></u-gap>
                        </view>
                    </scroll-view>
                    <!-- 优惠劵 -->
                    <view
                        @click.stop="openCouponShow"
                        class="flex_wrap row_between"
                        style="box-sizing: border-box; margin: 32rpx 0"
                    >
                        <view class="flex_wrap">
                            <u--image
                                :showLoading="true"
                                src="https://oneredhealth.oss-cn-hangzhou.aliyuncs.com/2023/10/25/0d5e50e7f057489f885ad8aa9ddee486.png"
                                width="52rpx"
                                height="47rpx"
                            ></u--image>
                            <view style="width: 10rpx"></view>
                            <u-text
                                text="十蜂优惠劵"
                                size="28rpx"
                                bold
                            ></u-text>
                        </view>
                        <view class="flex_wrap">
                            <u-text
                                v-if="!dataList.length"
                                text="暂无优惠劵"
                                size="28rpx"
                                bold
                                color="#FF3C3C"
                            ></u-text>
                            <u-text
                                v-if="dataList.length && !couponRadiovalue"
                                text="未选红包"
                                size="28rpx"
                                bold
                                color="#FF3C3C"
                            ></u-text>
                            <u-text
                                v-if="dataList.length && couponRadiovalue"
                                :text="`-￥${favorableFaceValue}`"
                                size="28rpx"
                                bold
                                color="#FF3C3C"
                            ></u-text>
                            <u-icon
                                name="arrow-right"
                                color="#D8D8D8"
                                size="18"
                            />
                        </view>
                    </view>
                    <u-gap
                        marginTop="32rpx"
                        marginBottom="32rpx"
                        height="2rpx;"
                        bgColor="#F3F3F3"
                    />
                    <!-- 礼品 商品 -->
                    <view
                        class="flex_wrap row_between"
                        style="
                            padding-right: 34rpx;
                            box-sizing: border-box;
                            margin: 32rpx 0;
                        "
                        v-if="authority === 'salesman'"
                    >
                        <view style="width: 200rpx">
                            <u-text text="类型" size="28rpx" bold></u-text>
                        </view>
                        <view>
                            <u-radio-group placement="row" v-model="giftType">
                                <u-radio
                                    activeColor="red"
                                    label="商品"
                                    :name="0"
                                ></u-radio>
                                <view style="width: 30rpx"></view>
                                <u-radio
                                    activeColor="red"
                                    label="礼品"
                                    :name="1"
                                    :disabled="true"
                                ></u-radio>
                            </u-radio-group>
                        </view>
                    </view>
                    <view
                        class="flex_wrap row_between"
                        style="
                            padding-right: 34rpx;
                            box-sizing: border-box;
                            margin-bottom: 32rpx;
                        "
                    >
                        <view style="width: 200rpx">
                            <u-text text="购买数量" size="28rpx" bold></u-text>
                        </view>
                        <u-number-box
                            v-model="productCount"
                            :min="getQuantity === 0 ? 0 : 1"
                            :max="getQuantity"
                            integer
                        ></u-number-box>
                    </view>

                    <u-button
                        :disabled="productCount === 0 ? true : false"
                        text="立即购买"
                        color="#588BF3"
                        :customStyle="{
                            ...buttonCustomStyle,
                            width: '694rpx',
                            marginBottom: '40rpx',
                        }"
                        shape="circle"
                        @click="buy()"
                    />
                </view>
            </u-popup>
        </view>
        <!-- 转发弹框 -->
        <u-popup
            :show="showShare"
            mode="bottom"
            @close="closeShare"
            @open="openShare"
            :closeable="true"
            @touchmove.stop.prevent="() => {}"
        >
            <view
                style="
                    height: 324rpx;
                    text-align: center;
                    font-size: 28rpx;
                    margin-top: 12rpx;
                "
                @touchmove.stop.prevent="() => {}"
            >
                <text>分享给</text>
                <view
                    class=""
                    style="
                        margin-top: 50rpx;
                        display: flex;
                        justify-content: center;
                    "
                >
                    <button open-type="share">
                        <u-icon
                            name="/static/images/card/weixin.png"
                            size="40"
                            labelPos="bottom"
                            space="10"
                            label="微信好友"
                        />
                    </button>
                    <!-- <button @click="QRcodeFun">
                        <u-icon
                            name="https://oneredhealth.oss-cn-hangzhou.aliyuncs.com/2024/05/15/620ca1a4d69b4b04b48a691be3771a4c.png"
                            size="40"
                            labelPos="bottom"
                            space="10"
                            label="商品二维码"
                        />
                    </button> -->
                </view>
            </view>
        </u-popup>
        <!-- 优惠劵 -->
        <view>
            <u-popup
                :round="20"
                :show="couponShow"
                @close="closeCoupon"
                bgColor="#F6F6F6"
                :closeOnClickOverlay="false"
            >
                <view class="couponBox flex_wrap flex_column">
                    <view class="title">
                        <text>选择优惠劵</text>
                        <view @click="closeCoupon" class="closeAddress">
                            <u-icon
                                name="close"
                                color="#7B7B7B"
                                size="20"
                                bold
                            />
                        </view>
                    </view>
                    <view class="cellBox">
                        <u-radio-group
                            v-model="couponRadiovalue"
                            placement="column"
                            @change="couponChange"
                        >
                            <view
                                class="detail"
                                v-for="(item, index) in dataList"
                                :key="index"
                            >
                                <view class="detail_title">
                                    <!-- 列表 -->
                                    <view class="list flex_wrap row_between">
                                        <view class="flex_wrap row_middle">
                                            <u-icon
                                                name="https://oneredhealth.oss-cn-hangzhou.aliyuncs.com/2023/10/25/c61f6633bd394bfba8c1ab7c545a3dee.png"
                                                size="112rpx"
                                            />
                                            <view>
                                                <u-text
                                                    :text="item.favorableTitle"
                                                    bold
                                                    size="28rpx"
                                                    color="#3D3D3D "
                                                    margin="0 0 0 20rpx"
                                                />
                                                <u-text
                                                    :text="
                                                        `有效期限至` +
                                                        $u.timeFormat(
                                                            item.cutOffTime,
                                                            'yyyy-mm-dd'
                                                        )
                                                    "
                                                    size="24rpx"
                                                    color="#FF3C3C "
                                                    margin="18rpx 0 0 20rpx"
                                                />
                                            </view>
                                        </view>
                                        <view>
                                            <view class="shopping-cart-box">
                                                <text>￥</text>
                                                <text
                                                    style="
                                                        font-size: 48rpx;
                                                        font-weight: 500;
                                                    "
                                                >
                                                    {{
                                                        formatDecimal(
                                                            numDiv(
                                                                item.favorableFaceValue,
                                                                100
                                                            )
                                                        )
                                                    }}
                                                </text>
                                            </view>
                                            <u-text
                                                text="无门槛"
                                                size="24rpx"
                                                color="#777"
                                                align="right"
                                                margin="6rpx 0 0 0"
                                            />
                                        </view>
                                    </view>
                                    <!-- 按钮部分 -->
                                    <u-line dashed color="#CCCCCC"></u-line>
                                    <view
                                        class="btnBox flex_wrap row_between row_middle"
                                    >
                                        <view
                                            class="flex_wrap"
                                            @click="
                                                () => {
                                                    modalShow = true;
                                                    rule =
                                                        item.favorableDescription;
                                                }
                                            "
                                        >
                                            <text class="infoBox">{{
                                                item.favorableDescription
                                            }}</text>
                                            <u-icon
                                                size="16rpx"
                                                name="arrow-up"
                                                labelPos="left"
                                                color="#666"
                                                bold
                                                :customStyle="{
                                                    width: '400rpx',
                                                }"
                                            />
                                        </view>
                                        <u-radio
                                            activeColor="#FF3C3C"
                                            :key="index"
                                            :name="item.getId"
                                        ></u-radio>
                                    </view>
                                </view>
                            </view>
                        </u-radio-group>
                    </view>
                    <view class="flex_wrap btnWrap" @click="okCouponBtn">
                        <view class="flex_wrap couponWrap">
                            <u-text
                                text="红包可减"
                                align="right"
                                size="24rpx"
                                color="#3D3D3D"
                            />
                            <u-text
                                :text="`-￥${btnfavorableFaceValue}`"
                                size="24rpx"
                                color="#FF3C3C"
                                bold
                            />
                        </view>
                        <view class="okBtnBox">确定</view>
                    </view>
                </view>
            </u-popup>
        </view>
        <u-popup
            :show="modalShow"
            :round="8"
            mode="center"
            @close="modalShow = false"
            :customStyle="popupCustomStyle"
        >
            <view>
                <u-text
                    text="使用规则"
                    bold
                    size="36rpx"
                    color="#3D3D3D"
                    align="center"
                />
                <u-text
                    margin="40rpx 0 48rpx"
                    :text="rule || '暂无说明'"
                    size="24rpx"
                    color="#777777"
                />
                <u-button
                    shape="circle"
                    :customStyle="{
                        background: '#588BF3',
                        color: '#fff',
                        fontSize: '32rpx',
                        height: '96rpx',
                    }"
                    text="我知道了"
                    @click="modalShow = false"
                />
            </view>
        </u-popup>
        <u-popup
            :show="showQR"
            mode="center"
            @close="showQR = false"
            @touchmove.stop.prevent="() => {}"
        >
            <view>
                <u--image
                    :src="showImgData"
                    width="200px"
                    height="200px"
                ></u--image>
                <u-text
                    text="长按转发或下载"
                    size="32rpx"
                    color="#3D3D3D"
                    align="center"
                    margin="20rpx 0 30rpx"
                />
            </view>
        </u-popup>
        <u-popup
            :show="noGoodPrompt"
            mode="center"
            @close="noGoodPrompt = false"
            @touchmove.stop.prevent="() => {}"
            :round="10"
            bgColor="rgba(0, 0, 0, 0.6)"
            :customStyle="{
                padding: '30rpx 40rpx 0',
                height: '96rpx',
            }"
        >
            <view>
                <u-text
                    text="非常抱歉，优惠活动商品已结束"
                    size="32rpx"
                    color="#fff"
                    align="center"
                />
            </view>
        </u-popup>
    </view>
</template>

<script>
import chooseAddress from "../components/changeAddress";
import {
    getGoodsDetail,
    getGoodsDetailAuth,
    collectGoods,
    deleteCollect,
    getDiscountedPrice,
} from "@/api/shop.js";
import { appIdCard } from "@/api/card";
import { getMiniCodeByAppId } from "@/api/order.js";
import {
    confirmOrder,
    ticketHasBeenClaimed,
    getActiveGoodsById,
} from "@/api/order.js";
import {
    numAdd,
    numSub,
    numMulti,
    numDiv,
} from "@/js_sdk/nl-precisionNum/precisionNum.js";
import { formatDecimal } from "@/utils/index.js";
import { mapGetters } from "vuex";
import { getCustomerInfoByToken } from "@/api/login.js";
let couponChangeData = "";
let activeGoodsId = "";
export default {
    data() {
        return {
            popupCustomStyle: {
                width: "612rpx",
                padding: "48rpx 48rpx 40rpx",
            },
            rule: "",
            btnShow: true,
            showAddress: false,
            modalShow: false,
            showShare: false,
            couponShow: false,
            productCount: 1,
            show: false,
            productId: "",
            buttonCustomStyle: {
                width: "574rpx",
                height: "80rpx",
                outline: "none",
                border: "none",
                // fontSize: '32rpx'
            },
            currentProduct: {},
            currentNum: 0,
            formatDecimal: formatDecimal,
            numAdd, //加
            numSub, //减
            numMulti, //乘
            numDiv, //除
            giftType: 0,
            authority: this.$store.getters?.authority,
            dataList: [],
            couponRadiovalue: "",
            favorableFaceValue: 0,
            btnfavorableFaceValue: 0,
            specialPrice: null, //优选价
            customerInfo: null,
            hideBtn: null,
            promoteSalesmanId: "",
            appId: this.$appId,
            showQR: false,
            showImgData: "",
            noGoodPrompt: false,
            unitPrice: 0,
            showOriginalPrice: 0,
        };
    },
    components: {
        chooseAddress,
    },
    beforeDestroy() {
        if (this.isLogin) {
            uni.removeStorageSync("loginBackUrl");
            uni.removeStorageSync("loginBackUrlOption");
        }
    },
    onLoad(options) {
        console.log(options, "options>>");
        // console.log(options, "角色 :>> ", this.$store.getters?.authority);
        // this.productId = options.id || options.scene;
        this.hideBtn = options?.hideBtn ?? null;
        this.couponRadiovalue = options.getId || "";
        var pages = getCurrentPages(); // 获取栈实例
        console.log(pages, "pages>>>");
        if (pages.length === 1) {
            let currentRoute = pages[pages.length - 1].route; // 获取当前页面路由
            let currentPage = pages[pages.length - 1]["$page"]["fullPath"]; //当前页面路径(带参数)
            console.log(currentRoute, "currentRoute>>>", currentPage);
            uni.setStorageSync("loginBackUrl", currentPage);
        }
        activeGoodsId = options.scene;
        if (options.promoteSalesmanId)
            this.promoteSalesmanId = options.promoteSalesmanId;
        if (!this.isLogin)
            return uni.navigateTo({ url: "/pages/user/phone/indexApp" });
        getActiveGoodsById(activeGoodsId).then((res) => {
            if (res.code === 200 && res.data) {
                this.orderMessage = res.data;
                this.unitPrice = res.data.unitPrice;
                this.productId = this.orderMessage.goodsId;
                this.showOriginalPrice = this.orderMessage.showOriginalPrice;
                this.getGoodsDetailById(this.productId);
            }
        });
        // if (options.promoteSalesmanId)
        //     this.promoteSalesmanId = options.promoteSalesmanId;
        // this.getGoodsDetailById(this.productId);
        // // 优惠劵 getId 优惠劵ID
        // this.ticketHasBeenClaimedFun({
        //     goodsId: this.productId,
        //     pageNum: 1,
        //     pageSize: 500,
        //     useCondition: 99,
        // });
    },

    computed: {
        ...mapGetters(["isLogin", "phone", "userInfo"]),
        getQuantity() {
            // 获取库存
            if (
                this.currentProduct.goodsSkuList &&
                this.currentProduct.goodsSkuList.length
            ) {
                // 如果存在sku
                const result = this.currentProduct.goodsSkuList.filter(
                    (item) => {
                        return this.getSimpleSpecs === item.simpleSpecs;
                    }
                );
                if (result) {
                    return result[0].quantity;
                } else {
                    return 0;
                }
            } else {
                //否则;
                return this.currentProduct && this.currentProduct.quantity;
            }
        },
        getSimpleSpecs() {
            const specs =
                (this.currentProduct.simpleSpecs &&
                    this.currentProduct.simpleSpecs.map((item) => {
                        const value = item.items.filter((itemsItem) => {
                            return itemsItem.checked === true;
                        })[0].value;
                        return value;
                    })) ||
                [];
            return specs.join(";");
        },
        getSkuId() {
            if (
                this.currentProduct.goodsSkuList &&
                this.currentProduct.goodsSkuList.length > 0
            ) {
                // 如果存在sku
                const sku =
                    this.currentProduct &&
                    this.currentProduct.goodsSkuList.filter((item) => {
                        return item.simpleSpecs === this.getSimpleSpecs;
                    });
                if (sku && sku.length > 0) {
                    return sku[0].id;
                } else {
                    return sku;
                }
            } else {
                // 否则
                return null;
            }
        },
        getPriceSkuPrice() {
            let currentMoney = 0;
            if (
                this.currentProduct.goodsSkuList &&
                this.currentProduct.goodsSkuList.length > 0
            ) {
                const sku =
                    this.currentProduct &&
                    this.currentProduct.goodsSkuList.filter((item) => {
                        return item.simpleSpecs === this.getSimpleSpecs;
                    });
                if (sku && sku.length > 0) {
                    currentMoney = numDiv(
                        numDiv(
                            sku[0].price * this.currentProduct.discount,
                            100
                        ),
                        100
                    );
                } else {
                    currentMoney = 0;
                }
            } else {
                currentMoney =
                    this.currentProduct &&
                    numDiv(
                        numDiv(
                            this.currentProduct.price *
                                this.currentProduct.discount,
                            100
                        ),
                        100
                    );
            }
            // 优惠劵
            // if (this.couponRadiovalue && this.favorableFaceValue) {
            // 	currentMoney = numSub(currentMoney, this.favorableFaceValue)
            // }
            return currentMoney;
        },
        getPrice() {
            let currentMoney = 0;
            if (
                this.currentProduct.goodsSkuList &&
                this.currentProduct.goodsSkuList.length > 0
            ) {
                // 如果存在sku
                const sku = this.currentProduct.goodsSkuList.filter(
                    (item) => item.simpleSpecs === this.getSimpleSpecs
                );
                if (sku && sku.length > 0) {
                    // 折扣
                    currentMoney = numMulti(
                        formatDecimal(
                            numDiv(
                                numDiv(
                                    sku[0].price * this.currentProduct.discount,
                                    100
                                ),
                                100
                            )
                        ),
                        this.productCount
                    );
                } else {
                    currentMoney = 0;
                }
            } else {
                //否则
                currentMoney =
                    this.currentProduct &&
                    numMulti(
                        formatDecimal(
                            numDiv(
                                numDiv(
                                    this.currentProduct.price *
                                        this.currentProduct.discount,
                                    100
                                ),
                                100
                            )
                        ),
                        this.productCount
                    );
            }
            // 优惠劵
            if (this.couponRadiovalue && this.favorableFaceValue) {
                currentMoney = numSub(currentMoney, this.favorableFaceValue);
            }
            return currentMoney;
        },
    },
    onPullDownRefresh() {
        this.getGoodsDetailById(this.productId).then(() => {
            uni.stopPullDownRefresh();
        });
    },
    methods: {
        QRcodeFun() {
            this.showShare = false;
            const that = this;
            const params = {
                page: "pages_shop1/goods/index",
                scene: that.currentProduct.id,
                env_version: __wxConfig.envVersion,
                check_path: false,
                appId: that.appId,
            };
            getMiniCodeByAppId(params).then((res) => {
                if (res.code === 200 && res.data) {
                    that.showQR = true;
                    var showImgData = res.data;
                    that.showImgData = "data:image/png;base64," + showImgData;
                }
            });
        },

        toBuy() {
            uni.navigateTo({
                url: `/pages_shop1/pay/confirmOrder/index?scene=${activeGoodsId}&promoteSalesmanId=${this.promoteSalesmanId}`,
            });
        },

        radioClick(name, index) {
            this.currentProduct.simpleSpecs[index].items.map(
                (item, itemIndex) => {
                    item.checked = itemIndex === name ? true : false;
                }
            );
            // sku更换后 重新设置初始购买数量（如果库存不够了就设置为0反之为1）
            if (this.getQuantity === 0) {
                this.productCount = 0;
            } else {
                this.productCount = 1;
            }
            this.discountedPrice();
        },
        previewDetailImage(currentImage) {
            const that = this;
            uni.previewImage({
                current: currentImage,
                urls: this.currentProduct.detailImage,
                indicator: "number",
            });
        },
        topImageClick() {
            const that = this;
            uni.previewImage({
                current: that.currentProduct?.topImage[that.currentNum],
                urls: this.currentProduct?.topImage,
                indicator: "number",
            });
        },
        async getGoodsDetailById(id) {
            const result = this.isLogin
                ? await getGoodsDetail(
                      id,
                      this.$store.getters.userInfo.tenantId
                  )
                : await getGoodsDetailAuth(id);
            let currentProduct = result.data || {};
            if (currentProduct) {
                const topImage =
                    (currentProduct.topImage &&
                        currentProduct.topImage.split(",")) ||
                    [];
                const thumbnail =
                    (currentProduct.thumbnail &&
                        currentProduct.thumbnail.split(",")) ||
                    null;
                const detailImage =
                    (currentProduct.detailImage &&
                        currentProduct.detailImage.split(",")) ||
                    null;
                const keyword = currentProduct.keyword
                    ? currentProduct.keyword.split(",")
                    : [];
                const simpleSpecs = JSON.parse(currentProduct.simpleSpecs);
                const simpleSpecsFormat =
                    simpleSpecs && simpleSpecs.length > 0
                        ? simpleSpecs.map((item) => {
                              item.items.forEach(
                                  (itemsItem, itemsItemIndex) => {
                                      itemsItem.checked = false;
                                      if (itemsItemIndex === 0) {
                                          itemsItem.checked = true;
                                      }
                                  }
                              );
                              return item;
                          })
                        : [];
                this.currentProduct = {
                    ...currentProduct,
                    topImage,
                    thumbnail,
                    detailImage,
                    keyword,
                    simpleSpecs: simpleSpecsFormat,
                };
                // this.discountedPrice();
            }
        },

        onShareAppMessage: function () {
            // uni-app 会自动处理分享
            let that = this;
            const path =
                this.authority === "salesman"
                    ? "/pages_shop1/goods/index1?scene=" +
                      activeGoodsId +
                      "&promoteSalesmanId=" +
                      this.userInfo.id
                    : "/pages_shop1/goods/index1?scene=" + activeGoodsId;
            // 返回数据
            return {
                title: !this.showOriginalPrice
                    ? `【原价 ¥${numDiv(
                          that.currentProduct.price,
                          100
                      )} 抢购价 ￥${numDiv(that.unitPrice, 100)}】${
                          that.currentProduct.goodsName
                      }`
                    : `抢购价 ￥${numDiv(that.unitPrice, 100)}】${
                          that.currentProduct.goodsName
                      }`,

                imageUrl: that.currentProduct?.topImage[0] ?? "",
                path,
            };
        },
        onShareTimeline: function () {
            let that = this;
            return {
                title: that.currentProduct.goodsName,
                query: {
                    id: that.currentProduct.id,
                },
                imageUrl: that.currentProduct?.topImage[0] ?? "",
            };
        },
        changeAddress(id) {
            this.consigneeId = id;
        },
        closeShare() {
            this.showShare = false;
        },
        openShare() {
            this.showShare = true;
        },
        share() {
            this.showShare = true;
        },
        open() {},
        close() {
            this.show = false;
        },
        goTo() {
            uni.navigateTo({
                url: "/pages_shop1/information/index?goodsId=" + activeGoodsId,
            });
        },
        // 收藏商品
        async doCollect(key) {
            const { code, data, msg } = await collectGoods(key);
            if (code === 200) {
                this.currentProduct.ifCollection = true;
            }
        },

        // 取消收藏
        async cancelCollect(key) {
            const { code, data, msg } = await deleteCollect(key);
            if (code === 200) {
                this.currentProduct.ifCollection = false;
            }
        },
    },
};
</script>

<style lang="scss">
.box {
    color: #333;
    background-color: #fff;
    ::v-deep .u-button__text {
        font-size: 30rpx !important;
    }
    ::v-deep .u-tag--medium {
        min-width: 124rpx;
        padding: 6rpx 34rpx;
        box-sizing: border-box;
        font-size: 24rpx;
        justify-content: center;
    }

    ::v-deep .u-tag--primary {
        background-color: #588bf3 !important;
    }

    ::v-deep .u-tag__text--primary--plain {
        color: #333 !important;
    }

    ::v-deep .u-tag__text {
        font-weight: bold !important;
    }
}

.indicator {
    @include flex(row);
    justify-content: center;

    &__dot {
        height: 6px;
        width: 6px;
        border-radius: 100px;
        background-color: rgba(255, 255, 255, 0.35);
        margin: 0 5px;
        transition: background-color 0.3s;

        &--active {
            background-color: #ffffff;
        }
    }
}

.indicator-num {
    padding: 2px 0;
    background-color: rgba(0, 0, 0, 0.35);
    border-radius: 100px;
    width: 35px;
    @include flex;
    justify-content: center;

    &__text {
        color: #ffffff;
        font-size: 12px;
    }
}

.title {
    padding: 40rpx 28rpx 24rpx;
}

.price {
    font-size: 50rpx;
    font-weight: bold;
    color: #ff0000;
    margin-top: 20rpx;
    .price_t {
        font-size: 24rpx;
    }
}
.price1 {
    font-size: 30rpx;
    font-weight: bold;
    color: #a4a4a4;
    text-decoration: line-through;
    display: flex;
    align-items: center;
    margin-left: 16rpx;
    margin-top: 20rpx;
    .price_t {
        font-size: 24rpx;
    }
}
.price_total {
    display: flex;
    font-size: 40rpx;
    font-weight: bold;
    color: #ff0000;
    align-items: center;
    padding-bottom: 24rpx;
    .price_t {
        font-size: 24rpx;
    }
    .price_actual {
        display: flex;
        align-items: center;
        margin-left: 34rpx;
        font-weight: 400;
        height: 56rpx;
        padding: 0 34rpx;
        background: #ff3c3c;
        border-radius: 4000rpx;
        color: #fff;
        font-size: 24rpx;
        .price_actual_t {
            font-size: 36rpx;
        }
    }
}
.locations {
    width: 100%;
    padding: 0 16rpx 0 26rpx;
    text-align: left;
    &_name {
        font-size: 28rpx;
        color: #3d3d3d;
        font-weight: 500;
        text {
            margin-right: 32rpx;
        }
        .default {
            margin-left: -12rpx;
            width: 86rpx;
            height: 36rpx;
            border-radius: 4rpx;
            border: 2rpx solid #588bf3;
            font-size: 24rpx;
            color: #588bf3;
            display: block;
            text-align: center;
            font-weight: 400;
        }
    }
    &_detail {
        size: 24rpx;
        color: #666;
        font-weight: 400;
    }
}
// 收货地址弹框
.takeAddress {
    height: 120rpx;
    background: #e2ebff;
    border-radius: 40rpx 40rpx 0rpx 0rpx;
    line-height: 120rpx;
    text-align: center;
    font-size: 40rpx;
    font-weight: 500;
    color: #3d3d3d;
}
.closeAddress {
    position: absolute;
    top: 40rpx;
    right: 32rpx;
}
.manageAddress {
    padding: 28rpx 28rpx 28rpx 40rpx;
    font-size: 32rpx;
    font-weight: 500;
    color: #333333;
}
.noaddress {
    margin: 120rpx auto 240rpx;
}
.address_list {
    padding: 0 28rpx 92rpx;
    overflow: hidden;
    &_bg {
        padding: 40rpx 28rpx 32rpx;
        max-height: 900rpx;
        background: #ffffff;
        border-radius: 20rpx;
        overflow-y: auto;
    }
    &_elsebg {
        max-height: 900rpx;
        border-radius: 20rpx;
        overflow-y: auto;
    }
    &_elsebgList {
        background: #ffffff;
        border-radius: 20rpx;
        margin-bottom: 40rpx;
        padding: 40rpx 28rpx 12rpx;
    }
}

.title-t {
    height: auto;
    display: flex;
    flex-wrap: wrap;
    text {
        display: block;
        width: 124rpx;
        height: 46rpx;
        margin-right: 12rpx;
        background: rgba(88, 139, 243, 0.2);
        border-radius: 2rpx;
        font-size: 26rpx;
        color: #588bf3;
        text-align: center;
        line-height: 46rpx;
    }
}

.typeNormal {
    text {
        display: block;
        min-width: 124rpx;
        width: auto;
        height: 46rpx;
        font-size: 24rpx;
        color: #333333;
        background: #ffffff;
        border-radius: 4rpx;
        text-align: center;
        line-height: 46rpx;
        margin-right: 28rpx;
        opacity: 1;
        border: 1px solid #588bf3;
    }
}

.typeChoose {
    .tag-item {
        margin-right: 20rpx;
        margin-bottom: 24rpx;
    }

    .specs {
        display: flex;
        flex-wrap: wrap;
    }
}

.address {
    padding: 20rpx 28rpx 24rpx;

    image {
        width: 100%;
    }
}

.detailImages {
    width: 100vw;
}

.purchase {
    position: fixed;
    min-height: 116rpx;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100vw;
    height: auto;
    padding: 18rpx 0;
    background: #ffffff;
    box-shadow: 8rpx 0px 8rpx 2rpx rgba(0, 0, 0, 0.25);
    // padding-left: 40rpx;
}

.del {
    padding-left: 88rpx;
}

// 规格弹框
.specifications {
    padding: 20rpx 28rpx;
}

// 购买数量加减
.minus {
    width: 50rpx;
    height: 50rpx;
    border: 2rpx solid #e2e2e2;
    border-radius: 50%;
    @include flex;
    justify-content: center;
    align-items: center;
}

.input {
    padding: 10rpx;
    min-width: 50rpx;
}

.plus {
    width: 50rpx;
    height: 50rpx;
    background-color: #588bf3;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

button {
    position: relative;
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-left: 14px;
    padding-right: 14px;
    box-sizing: border-box;
    font-size: 18px;
    text-align: center;
    text-decoration: none;
    line-height: 1;
    border-radius: 5px;
    -webkit-tap-highlight-color: transparent;
    overflow: hidden;
    color: #000000;
    background-color: #fff;
    font-size: 28rpx;
}

// 边框样式ff
button::after {
    border: 0;
}
.couponBox {
    height: 80vh;
    overflow-y: scroll;
    .title {
        text-align: center;
    }
    .cellBox {
        flex: 1;
        width: 92vw;
        margin: 0 auto;
        overflow-y: scroll;
        ::v-deep .u-cell {
            box-shadow: 0 0 12rpx 2rpx rgba(0, 0, 0, 0.08);
            margin-top: 32rpx;
            border-radius: 20upx;
        }
        .list {
            padding-bottom: 30rpx;
        }
        .btnBox {
            height: 72rpx;
            &_btn {
                width: 142rpx;
                height: 52rpx;
                background: linear-gradient(90deg, #ff6e45 0%, #fe5037 100%);
                border-radius: 52rpx;
                text-align: center;
                font-size: 28rpx;
                color: #ffffff;
                line-height: 52rpx;
            }
        }
    }
    .detail {
        width: 100%;
        box-sizing: border-box;
        border-radius: 20rpx;
        margin-top: 32rpx;
        background: #ffffff;

        &_title {
            width: 100%;
            padding: 36rpx 32rpx 0;
            box-sizing: border-box;
            position: relative;
        }
    }
    .shopping-cart-box {
        box-sizing: border-box;

        text {
            color: #ff0000;
            font-size: 28rpx;
        }
    }
    .cardbg {
        position: absolute;
        bottom: 0rpx;
        right: 0rpx;
    }
}
.btnWrap {
    height: 116rpx;
    justify-content: center;
    .couponWrap {
        width: 60%;
        height: 84rpx;
        background-color: #ccddff;
        border-top-left-radius: 200rpx;
        border-bottom-left-radius: 200rpx;
    }
    .okBtnBox {
        width: 184rpx;
        height: 84rpx;
        background: #588bf3;
        opacity: 1;
        line-height: 84rpx;
        text-align: center;
        color: #ffff;
        font-size: 28rpx;
        border-top-right-radius: 200rpx;
        border-bottom-right-radius: 200rpx;
        font-weight: bold;
    }
}
.infoBox {
    color: #777;
    font-size: 24rpx;
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    width: 200rpx;
}
</style>
